/*
  学习目标：React创建组件-clas组件  类组件
*/

import React from 'react';

import ReactDOM from 'react-dom';

export default console.log('React  ----->  ', React);

// 创建上
// 语法：class Xxxx extends React.Component
//       extends代表继承
// 注意：💥
//  1. 组件名大写开头
//  2. 必须要有render， render是一个钩子函数，会自动执行，render负责创建DOM，
//  3. render必须有返回值，如果不需要显示任何内容，返回null
class HelloClass extends React.Component {
  // render必须要有
  render() {
    return <h1>Hello - Class</h1>;
    // ❌
    // return undefined;
  }
}

const divNode = (
  <div>
    {/* 使用上：规则和函数组件，一模一样 */}
    <HelloClass></HelloClass>
  </div>
);

ReactDOM.render(divNode, document.getElementById('root'));
